<!DOCTYPE html>
<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="../admin/authority.jsp" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<%@include file="headScriptRQ.jsp"%>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/assets/js/rq/cs61001script.js"></script>
</head>
<body>
	<input type="hidden" name="userId" id="userId" value ="${user_id}">
	<input type="hidden" name="siteId" id="siteId" value ="${site_id}">
	<div class="wrapper">
		<!-- BEGIN Top-Bar -->
		<%@ include file="../fragments/header.jsp"%>
		<!-- END Top-Bar -->

		<div id="detail-area" class="clearfix">
			<!-- BEGIN SIDEMENU -->
			<div class="hidden-xs hidden-sm page-sidebar" id="side-menu-bar">
				<ul class="page-sidebar-menu">					

					<!-- <div id="displaymenu"></div>  -->
					<%@ include file="../admin/menu.jsp" %>

				</ul>
			</div>
			<!-- End Side Menu -->

			<div class="col-sm-12 col-xs-12" id="right-side">
				<div id="navigator-bar"><i class="fa fa-home"></i> หน้าหลัก <i class="fa fa-angle-right ml-5 mr-5"></i> บันทึกคำร้องติดตั้งประปาใหม่ </div>
				<!--End navigator-bar-->
				<!-- ---------------------------------------------------------------------------------- -->
				<!-- Start detail-area -->	
				<div>
					<div>
						<div id="page-header" class="clearfix form-horizontal">
							<div>บันทึกคำร้องติดตั้งประปาใหม่</div>
						</div>
						<!-- set message -->
						<div id="success_message" class="alert alert-success hide"> <span class="fa-stack fa-lg"> <i class="fa fa-circle fa-stack-2x"></i> <i class="fa fa-check fa-stack-1x fa-inverse"></i> </span><span id="content_sucess"></span></div>
						<div id="error_message" class="alert alert-danger hide"> <span class="fa-stack fa-lg"> <i class="fa fa-circle fa-stack-2x"></i> <i class="fa fa-times fa-stack-1x fa-inverse"></i></span><span id="content_error"></span></div>
						
						<div class="form-detail clearfix" style="margin-bottom: -15px; padding: 0px 15px;">
							<form class="form-inline mb-10" role="form" action=""  method="post" id="frm1">
								<div style="text-align:right">
									<div class="form-group clearfix">
										<label for="inputKeyWordSearch" class="ml-5">เลขที่คำร้อง :</label>
										<input type="text" value="" class="form-control" name="inputKeyWordSearch" id="inputKeyWordSearch" placeholder="เลขที่คำร้อง">
										<button type="button" class="btn btn-primary" onclick="getRequest()"><i class="fa fa-search"></i> ค้นหา</button>
									</div>
								</div>
							</form>
						</div>
						
						<div id="form-nav">
							<div class="form-wizard box-first">
								<a href="#" onClick="return false;" data-link="form-1" class="step-link" id="form-tap-1">
									<div class="form-wizard-box active">1.ข้อมูลผู้ยื่นคำร้อง</div>
								</a>
							</div>
							<div class="form-wizard box-2">
								<a href="#" onClick="return false;" data-link="form-2" class="step-link" id="form-tap-2">
									<div class="form-wizard-box">2.ข้อมูลผู้ขอใช้น้ำ</div>
								</a>
							</div>
							<div class="form-wizard box-last">
								<a href="#" onClick="return false;" data-link="form-3" class="step-link" id="form-tap-3">
									<div class="form-wizard-box">3.ข้อมูลการติดตั้ง</div>
								</a>
							</div>
						</div>
						<!-- End form-nav-->

						<div class="form-detail clearfix">
							<form class="form-horizontal" role="form" method="post" id="form-data-register">
							<input type="hidden" name="process_type" id="process_type" value="insert"/>
							<input type="hidden" name="btn" id="btn" value=""/>
								<div id="form-1" class="form-step">
									<fieldset>
										<legend>ข้อมูลผู้ยื่นคำร้อง </legend>
										<div class="form-group">
											<label for="inputFName" class="col-sm-3 control-label">ชื่อ-นามสกุล<span
												class="comment">*</span></label>
											<div class="col-sm-7">
												<input type="text" class="form-control" id="stepOneInputName"
													name="stepOneInputName" placeholder="ชื่อ-นามสกุล ผู้ยื่นคำร้อง" />
											</div>
										</div>
										<div class="form-group">
											<label for="inputPassword3" class="col-sm-3 control-label">ที่อยู่ผู้ยื่น</label>
											<div class="col-sm-9 row">
												<div class="col-sm-6 mt-5">
													<label for="stepOneHomeNumber">บ้านเลขที่ <span
														class="comment">*</span></label> 
														<input type="text"
														class="form-control" id="stepOneInputHomeNumber" name="stepOneInputHomeNumber"
														placeholder="บ้านเลขที่" />
												</div>
												<div class="col-sm-12 mt-5">
													<label for="exampleInputEmail1">หมู่บ้าน/ซอย/ถนน </label> 
													<input type="text" class="form-control" 
														id="stepOneInputAddress" name="stepOneInputAddress"
														placeholder="หมู่บ้าน/ซอย/ถนน " />
												</div>
												<div class="col-sm-6 mt-5">
													<label for="exampleInputEmail1">ตำบล<span
														class="comment"> *</span></label> 
														<select class="form-control" id="stepOneInputCityCode" name="stepOneInputCityCode">
															<option value="">-- เลือกตำบล --</option>
														</select>
												</div>
												<div class="col-sm-6 mt-5">
													<label for="exampleInputEmail1">อำเภอ<spana
														class="comment"> *</span></label> 
														<select class="form-control" id="stepOneInputDistrictCode" name="stepOneInputDistrictCode">
															<option value="">-- เลือกอำเภอ --</option>
														</select>
												</div>
												<div class="col-sm-6 mt-5">
													<label for="exampleInputEmail1">จังหวัด<span
														class="comment"> *</span></label> 
														<select class="form-control" id="stepOneInputProvinceCode" name="stepOneInputProvinceCode">
															<option value="">-- เลือกจังหวัด --</option>
														</select>
												</div>
												<div class="col-sm-6 mt-5">
													<label for="exampleInputEmail1">รหัสไปรษณีย์<span
														class="comment">*</span></label> 
														<input type="text"
														class="form-control" id="stepOneInputPostCode" name="stepOneInputPostCode"
														placeholder="รหัสไปรษณีย์" />
												</div>
											</div>
										</div>
										<div class="form-group">
											<label for="inputPassword3" class="col-sm-3 control-label">โทรศัพท์(ผู้ยื่น)</label>
											<div class="col-sm-7">
												<input type="text" class="form-control" id="stepOneInputTelephone" name="stepOneInputTelephone"
													placeholder="โทรศัพท์(ผู้ยื่น)" />
											</div>
										</div>
										<hr />
										<div class="form-group">
											<div class="col-sm-offset-3 col-sm-9">
												<button type="button" id="btn-add-step-one" class="btn btn-primary">
													<i class="fa fa-floppy-o"></i> บันทึก
												</button>
												<button type="button" class="btn btn-primary"
												onclick="window.location.reload()">
												<i class="glyphicon glyphicon-refresh"></i> เริ่มใหม่
												</button>
											</div>
										</div>
									</fieldset>
								</div>
								<!-- END FORM 1 -->

								<div id="form-2" class="form-step">
									<fieldset>
										<legend>ข้อมูลผู้ขอใช้น้ำ</legend>
										
										<div class="form-group">
											<label for="inputPassword3" class="col-sm-3 control-label"></label>
											<div class="col-sm-4">
												<input name="checkLoadStep2" id="checkLoadStep2" type="checkbox" value="1">
												ข้อมูลเหมือนผู้ยื่นคำร้อง
											</div>
										</div>
										<div class="form-group">
											<label for="inputPassword3" class="col-sm-3 control-label">คำนำหน้าชื่อ
											</label>
											<div class="col-sm-3">
												<input type="text" class="form-control" id="stepTwoInputPname" name="stepTwoInputPname"
													placeholder="คำนำหน้าชื่อ" />
											</div>
										</div>
										<div class="form-group">
											<label for="inputFName" class="col-sm-3 control-label">ชื่อ<span
												class="comment">*</span></label>
											<div class="col-sm-3">
												<input type="text" class="form-control" id="stepTwoInputFname"
													name="stepTwoInputFname" placeholder="ชื่อ" />
											</div>
											<label for="inputLName" class="col-sm-2 control-label">นามสกุล<span
												class="comment">*</span></label>
											<div class="col-sm-3">
												<input type="text" class="form-control" id="stepTwoInputLname"
													name="stepTwoInputLname" placeholder="นามสกุล" />
											</div>
										</div>
										<div class="form-group">
											<label for="inputPassword3" class="col-sm-3 control-label">หมายเลขบัตรประชาชน(13หลัก)<span
												class="comment">*</span></label>
											<div class="col-sm-7" style="padding-top: 10px;">
												<input type="text" class="form-control" id="stepTwoInputIdCard" name="stepTwoInputIdCard"
													placeholder="หมายเลขบัตรประจำตัวประชาชน" />
											</div>
										</div>
										<div class="form-group">
											<label for="inputPassword3" class="col-sm-3 control-label">รหัสประจำบ้าน <br />(11  หลัก)<span
												class="comment">*</span></label>
											<div class="col-sm-7" style="padding-top: 10px;">
												<input type="text" class="form-control" id="stepTwoInputHomeCardId" name="stepTwoInputHomeCardId"
													placeholder="รหัสประจำบ้าน" />
											</div>
										</div>
										<div class="form-group">
											<label for="inputPassword3" class="col-sm-3 control-label">สถานที่ใช้น้ำ</label>
											<div class="col-sm-9 row">
												<div class="col-sm-6 mt-5">
													<label for="exampleInputEmail1">บ้านเลขที่ <span
														class="comment">*</span></label> <input type="text"
														class="form-control" id="stepTwoInputHomeNumber" name="stepTwoInputHomeNumber"
														placeholder="บ้านเลขที่" />
												</div>
												<div class="col-sm-12 mt-5">
													<label for="exampleInputEmail1">หมู่บ้าน/ซอย/ถนน </label> <input
														type="text" class="form-control" id="stepTwoInputAddress" name="stepTwoInputAddress"
														placeholder="หมู่บ้าน/ซอย/ถนน " />
												</div>
												<div class="col-sm-6 mt-5">
													<label for="exampleInputEmail1">ตำบล<span
														class="comment"> *</span></label> 
														<select class="form-control" id="stepTwoInputCityCode" name="stepTwoInputCityCode">
															<option value="">-- เลือกตำบล --</option>
														</select>
												</div>
												<div class="col-sm-6 mt-5">
													<label for="exampleInputEmail1">อำเภอ<span
														class="comment"> *</span></label> 
														<select class="form-control" id="stepTwoInputDistrictCode" name="stepTwoInputDistrictCode">
															<option value="">-- เลือกอำเภอ --</option>
														</select>
												</div>
												<div class="col-sm-6 mt-5">
													<label for="exampleInputEmail1">จังหวัด<span
														class="comment"> *</span></label> 
														<select class="form-control" id="stepTwoInputProvinceCode" name="stepTwoInputProvinceCode">
															<option value="">-- เลือกจังหวัด --</option>
														</select>
												</div>
												<div class="col-sm-6 mt-5">
													<label for="exampleInputEmail1">รหัสไปรษณีย์<span
														class="comment"> *</span></label> 
														<input type="text"
														class="form-control" id="stepTwoInputPostCode" name="stepTwoInputPostCode"
														placeholder="รหัสไปรษณีย์" />
												</div>
											</div>
										</div>
										<div class="form-group">
											<label for="inputPassword3" class="col-sm-3 control-label">โทรศัพท์(ที่ใช้น้ำ)</label>
											<div class="col-sm-7">
												<input type="text" class="form-control" id="stepTwoInputTelephoneUser" name="stepTwoInputTelephoneUser"
													placeholder="โทรศัพท์(ที่ใช้น้ำ)" />
											</div>
										</div>
										<div class="form-group">
											<label for="checkLoadData" class="col-sm-3 control-label"></label>
											<div class="col-sm-7">
												<input type="checkbox" id="checkLoadDataContact" name="checkLoadDataContact" value="1"/>
												ข้อมูลเหมือนผู้ใช้น้ำ
											</div>
										</div>
										<div class="form-group">
											<label for="inputPassword3" class="col-sm-3 control-label">ชื่อ-นามสกุล (ผู้ติดต่อ)</label>
											<div class="col-sm-7">
												<input type="text" class="form-control" id="stepTwoInputNameContact" name="stepTwoInputNameContact"
													placeholder="ชื่อ-นามสกุล" />
											</div>
										</div>
										<div class="form-group">
											<label for="inputPassword3" class="col-sm-3 control-label">สถานที่ติดต่อ</label>
											<div class="col-sm-9 row">
												<div class="col-sm-6 mt-5">
													<label for="exampleInputEmail1">บ้านเลขที่ <span
														class="comment">*</span></label> 
														<input type="text"
														class="form-control" id="stepTwoInputHomeNumberContact" name="stepTwoInputHomeNumberContact"
														placeholder="บ้านเลขที่" />
												</div>
												<div class="col-sm-12 mt-5">
													<label for="exampleInputEmail1">หมู่บ้าน/ซอย/ถนน </label> <input
														type="text" class="form-control" id="stepTwoInputAddressContact" name="stepTwoInputAddressContact"
														placeholder="หมู่บ้าน/ซอย/ถนน " />
												</div>
												<div class="col-sm-6 mt-5">
													<label for="exampleInputEmail1">ตำบล<span
														class="comment"> *</span></label> 
														<select class="form-control" id="stepTwoInputCityCodeContact" name="stepTwoInputCityCodeContact">
															<option value="">-- เลือกตำบล --</option>
														</select>
												</div>
												<div class="col-sm-6 mt-5">
													<label for="exampleInputEmail1">อำเภอ<span
														class="comment"> *</span></label> 
														<select class="form-control" id="stepTwoInputDistrictCodeContact" name="stepTwoInputDistrictCodeContact">
															<option value="">-- เลือกอำเภอ --</option>
														</select>
												</div>
												<div class="col-sm-6 mt-5">
													<label for="exampleInputEmail1">จังหวัด<span
														class="comment"> *</span></label> 
														<select class="form-control" id="stepTwoInputProvinceCodeContact" name="stepTwoInputProvinceCodeContact">
															<option value="">-- เลือกจังหวัด --</option>
														</select>
												</div>
												<div class="col-sm-6 mt-5">
													<label for="exampleInputEmail1">รหัสไปรษณีย์<span
														class="comment"> *</span></label> 
														<input type="text"
														class="form-control" id="stepTwoInputPostCodeContact" name="stepTwoInputPostCodeContact"
														placeholder="รหัสไปรษณีย์" />
												</div>
											</div>
										</div>
										<div class="form-group">
											<label for="inputPassword3" class="col-sm-3 control-label">โทรศัพท์(ที่ติดต่อ)</label>
											<div class="col-sm-7">
												<input type="text" class="form-control" id="stepTwoInputTelephoneContact" name="stepTwoInputTelephoneContact"
													placeholder="โทรศัพท์(ที่ติดต่อ)" />
											</div>
										</div>
										<div class="form-group">
											<label for="inputPassword3" class="col-sm-3 control-label">ค่าเก็บขยะ</label>
											<div class="col-sm-3">
												<input type="text" class="form-control" id="stenTwoInputGarbageCharge" name="stenTwoInputGarbageCharge"
													placeholder="ค่าเก็บขยะ" />
											</div>
											<div class="col-sm-1 mt-5">บาท</div>
										</div>
										<div class="form-group">
											<label for="inputWasteWaterTreatMentCharge"
												class="col-sm-3 control-label">ค่าบำบัดน้ำเสีย</label>
											<div class="col-sm-3">
												<input type="text" class="form-control"
													id="stepTwoInputWasteWaterCharge" name="stepTwoInputWasteWaterCharge"
													value="" placeholder="ค่าบำบัดน้ำเสีย">
											</div>
											<div class="col-sm-1 mt-5">บาท</div>
										</div>
										<div class="form-group">
											<label for="inputOtherCharge" class="col-sm-3 control-label">ค่าอื่นๆ</label>
											<div class="col-sm-3">
												<input type="text" class="form-control"
													id="stepTwoInputOtherCharge" name="stepTwoInputOtherCharge" value="" placeholder="ค่าอื่นๆ">
											</div>
											<div class="col-sm-1 mt-5">บาท</div>
										</div>
										<hr />
										<div class="form-group">
											<div class="col-sm-offset-3 col-sm-9">
												<button type="button" id="btn-add-step-two" class="btn btn-primary">
													<i class="fa fa-floppy-o"></i> บันทึก
												</button>
												<button type="button" class="btn btn-primary"
												onclick="window.location.reload()">
												<i class="glyphicon glyphicon-refresh"></i> เริ่มใหม่
												</button>
											</div>
										</div>
									</fieldset>
								</div>
								<!-- END FORM 2-->

								<div id="form-3" class="form-step">
									<fieldset>
										<legend>ข้อมูลผู้ใช้น้ำ</legend>
										<div class="form-group">
											<label for="inputCustomerType" class="col-sm-3 control-label">ประเภทการติดตั้ง</label>
											<div class="col-sm-3">
												<select class="form-control" id="stepThreeInputCustomerType"
													name="stepThreeInputCustomerType">
													<option value="">-- เลือก --</option>
													<option value="P">ติดตั้งถาวร</option>
													<option value="T">ติดตั้งชั่วคราว</option>
												</select>
											</div>
											<label for="inputCustomerClass"
												class="col-sm-3 control-label">ประเภทผู้ใช้น้ำ <span
												class="comment">*</span></label>
											<div class="col-sm-3">
												<select class="form-control" id="stepThreeInputCustomerClass"
													name="stepThreeInputCustomerClass">
													<option value="">-- เลือก --</option>
												</select>
											</div>
										</div>
										<div class="form-group">
											<label for="inputAllowance" class="col-sm-3 control-label">ส่วนลดทหารผ่านศึก</label>
											<div class="col-sm-3">
												<select class="form-control" id="stepThreeInputAllowance"
													name="stepThreeInputAllowance">
													<option value="">-- เลือก --</option>
													<option value="0">ไม่มี</option>
													<option value="1">มี</option>
												</select>
											</div>
											<label for="inputStatus" class="col-sm-3 control-label"></label>
											<div class="col-sm-3">
											</div>
										</div>
										<div class="form-group">
											<label for="inputPassword3" class="col-sm-3 control-label">เอกสารประกอบคำร้อง</label>
											<div class="col-sm-4" style="padding-top: 10px;">
												<input type="checkbox" id="stepThreeInputDocument" name="stepThreeInputDocument" value="1"/> <label for="exampleInputEmail1">สำเนาทะเบียนบ้าน
												</label>
											</div>
										</div>
										<div class="form-group">
											<label for="inputPassword3" class="col-sm-3 control-label"></span></label>
											<div class="col-sm-4">
												<input type="checkbox" id="stepThreeInputDocument" name="stepThreeInputDocument" value="2" /> <label for="exampleInputEmail1">สำเนาบัตรประชาชน
												</label>
											</div>
										</div>
										<div class="form-group">
											<label for="inputPassword3" class="col-sm-3 control-label"></label>
											<div class="col-sm-4">
												<input type="checkbox" id="stepThreeInputDocument" name="stepThreeInputDocument" value="3" /> <label for="exampleInputEmail1">หนังสือมอบอำนาจ</label>
											</div>
										</div>
										<div class="form-group">
											<label for="inputPassword3" class="col-sm-3 control-label"></label>
											<div class="col-sm-2"
												style="width: 11%; margin-right: inherit;">
												<input type="checkbox" id="stepThreeInputDocument" name="stepThreeInputDocument" value="4"/> <label for="exampleInputEmail1">อื่นๆ</label>
											</div>
											<div class="col-sm-4">
												<input type="text" class="form-control" id="stepThreeInputComment" name="stepThreeInputComment" />
											</div>
										</div>
										<div class="form-group">
											<label for="inputMeterSize" class="col-sm-3 control-label">ขนาดมาตร
												<span class="comment">*</span>
											</label>
											<div class="col-sm-3">
												<select class="form-control" id="stepThreeInputMeterSize"
													name="stepThreeInputMeterSize">
													<option value="">-- เลือก --</option>
												</select>
											</div>
										</div>
										<div class="form-group">
											<label for="inputPassword3" class="col-sm-3 control-label"></label>
											<div class="col-sm-2" style="">
												<input type="radio" name="stepThreeInputCalculateMoney" id="stepThreeInputCalculateMoney" value="Y" checked="checked"/><label
													style="padding-left: 10px;"> คิดเงิน</label>
											</div>
											<div class="col-sm-2">
												<input type="radio" name="stepThreeInputCalculateMoney" id="stepThreeInputCalculateMoney" value="N" checked="checked"/><label
													style="padding-left: 10px;"> ไม่คิดเงิน</label>
											</div>
										</div>
										
										<div id='DisplayCalculateMoney' class='form-group'>
											<span id="itemShowValue"></span>
										</div>
										<hr />
										
										<div class="form-group">
											<div class="col-sm-offset-3 col-sm-9">
												<button type="button" id="btn-add-step-three" class="btn btn-primary">
													<i class="fa fa-floppy-o"></i> บันทึก
												</button>
												<button type="button" class="btn btn-primary"
												onclick="window.location.reload()">
												<i class="glyphicon glyphicon-refresh"></i> เริ่มใหม่
												</button>
											</div>
										</div>
									</fieldset>
								</div>
								<!-- END FORM 3-->

							</form>
						</div>
						<!-- End form-detail -->

					</div>
					<!-- End detail-area -->
					<div class="modal fade" id="confirmSaveData" tabindex=""
					role="dialog" aria-labelledby="failModal" aria-hidden="true">
					<div class="modal-dialog" style="width:450px">
						<div class="modal-content">
							<div class="modal-header">
								<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
								<h4 class="modal-title">ยืนยันการบันทึกคำร้องติดตั้งประปาใหม่</h4>
							</div>
							<div class="modal-body">
								<p><span class="fa-stack fa-lg mr-10" style=" color:#FC0"> <i class="fa fa-exclamation-triangle fa-stack-2x"></i></span>ยืนยันการบันทึกคำร้องติดตั้งประปาใหม่</p>
							</div>
							<div class="modal-footer">
								<button type="button" class="btn btn-primary" data-dismiss="modal" onclick="saveData()"><i class="fa fa-floppy-o"></i> ยืนยัน</button>
								<button type="button" class="btn btn-danger" data-dismiss="modal"><i class="glyphicon glyphicon-floppy-remove"></i> ยกเลิก</button>
							</div>
						</div>
					</div>
				</div>
					
				</div>
				<!-- END RIGHT DETAIL-->

				<div id="footer-detail">Copyright © สงวนลิขสิทธิ์ พ.ศ.2557
					โดยการประปานครหลวง</div>
			</div>
			<p></p>
		</div>
	</div>
</body>
</html>